{extend name='layout' /}

{block name='title'}
个人中心-{$Think.session.user.user_name}
{/block}

{block name="css"}
    <link rel="stylesheet" type="text/css" href="__HTP____URL__/public/static/css/userCenter.css">
{/block}

{block name='content'}
<div class="user-center">
    <form action="__HTP____URL__/index/User/uploadPic" enctype="multipart/form-data" method="post" onsubmit="return showPic()">
        <img src="{$Think.session.user.profile_pic}">
        <button>更换头像</button>
        <input type="file" name="image" />
    </form>
        <!-- <button onclick="clip()">重新裁剪</button> -->
</div>
<div class="user-center">
        <span>用户名 : </span>
        <div class="row-right"><b>{$Think.session.user.user_name}</b></div>
</div>
<div class="user-center">
        <span>UID : </span>
        <div class="row-right"><b>{$Think.session.user.uid}</b></div>
</div>
<div class="user-center">
        <span>密码 : </span>
        <div class="row-right"><b>******</b></div>
</div>
<script type="text/javascript">
	function showPic(){
		$.ajax({
			url:'__HTP____URL__/index/User/user/uploadPic',
			type:"POST",
      dataType: 'json',
			success:function(msg){alert(msg);return;
				var filePath = "__HTP____URL__/public/static/uploads/profile/";
        	$('.user-center img').attr('src',filePath);
			}
		})
	}
    function clip(){
        window.location.href= "__HTP____URL__/index/user/clip";
    }
	// 伪触发input[file]按钮
    $(function(){
        loadSuccess();
        $('.user-center input[type=file]').hover(function(){
        	$('.user-center button').css('background-color','#ccc');
        },function(){
        	$('.user-center button').css('background-color','white');
        });
        $('.user-center input[type=file]').change(function(){
        	// var filePath = $('.user-center input[type=file]').val();
        	// $('.user-center img').attr('src',filePath);
        	// alert($('.user-center img').attr('src'));
        	$('.user-center form').submit();
        });
    });
</script>
{/block}